
import React, { PureComponent } from 'react'
import { Row, Col, Input, Button } from 'antd';
import { connect } from 'react-redux'
import PageBackHeader from "@common/PageBackHeader";
import notify from "@utils/tip";
import { creatInventoryPurchaseRefund } from "@sagas/warehouse/purchase";
import WarehousePurchaseBackChoose from "@components/warehouse/WarehousePurchaseBackChoose";
import { withRouter } from 'react-router-dom'
import {getHistoryMatchParams} from "@utils/setUrlQuery";
function mapStateToProps(state) {
    const { warehouseManagement } = state
    return {
        selectedWarehouse: warehouseManagement.selectedWarehouse,
    }
}

@connect(
    mapStateToProps
    , {
        creatInventoryPurchaseRefund,
    })
@withRouter
class PurchaseBack extends PureComponent {

    constructor(props) {
        super(props);
        const { location } = props
        const { state } = location
        this.state = {
            order_number: state.order_number,
            initData: state,
            goodsItems: state.data || [],
            memo:''
        }

        this.cancelFunc = this.cancelFunc.bind(this)
    }

    submitForm() {
        const { goodsItems, memo, order_number } = this.state
        const { creatInventoryPurchaseRefund } = this.props
        const createParams = {
            id: this.props.selectedWarehouse,
            memo,
            orderNumber:order_number
        }
        if (!goodsItems.length) {
            notify('请添加商品', 'error')
            return
        }
        createParams.details = goodsItems.map(o => {
            return {
                index: o.index,
                storage_key: o.storage_key,
                storage_type: 2,
                quantity: o.quantity,
                price: o.price,
            }
        })
        if (goodsItems.some(item => typeof (item.quantity) === 'undefined' || item.quantity === '')) {
            notify('请填写数量', 'error')
            return
        }
        if (goodsItems.some(item => typeof (item.price) === 'undefined' || item.price === '')) {
            notify('请填写单价', 'error')
            return
        }
        if (memo === 'undefined' || memo === '') {
            notify('请输入订单备注', 'error')
            return
        }
        creatInventoryPurchaseRefund(createParams, () => {
            notify('提交成功', 'success')
            this.cancelFunc()
        })

    }

    cancelFunc() {
        this.props.goBack ? this.props.goBack() : this.props.history.goBack()
    }

    handleIdChange(value) {
        this.setState({
            warehouseId: value
        })
    }

    handleReasonChange(e) {
        this.setState({
            memo: e.currentTarget.value
        })
    }

    onValueChange(value) {
        this.setState({
            goodsItems: value
        })
    }

    render() {
        const { initData, memo } = this.state
        initData.data.map((item,index)=>{
            item.index = index
        })

        return (
            <div className="bilin-web">
                <PageBackHeader title='采购退货单' />
                <div className="bilin-web-body with-footer">
                    <div className="warehouse-check-inventory-page">
                        <Row className="check-line">
                            <Col span={4}>
                                <span className='ft-clr-d'>备注:</span>
                            </Col>
                            <Col span={18}>
                                <Input.TextArea value={memo}
                                    onChange={this.handleReasonChange.bind(this)}
                                    // style={{ width: '720px' }}
                                    rows={4}
                                    placeholder="必填"
                                    style={{ resize: 'none' }}
                                />
                            </Col>
                        </Row>
                        <WarehousePurchaseBackChoose value={initData.data || []} onChange={this.onValueChange.bind(this)} />
                    </div>
                </div>
                <div className="bilin-web-footer">
                    <Button type="primary" onClick={this.submitForm.bind(this)}>采购退货</Button>
                    <Button type="primary" ghost onClick={this.cancelFunc}>取消</Button>
                </div>
            </div>

        )
    }
}

export default PurchaseBack